<!-- BASE - this example uses relative URLs -->
<base href="https://raw.githubusercontent.com/heremaps/jsfiddle-github/master/custom-tile-overlay/" />

<!-- SCRIPTS -->
<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-core.js"></script>
<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-service.js"></script>
<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-ui.js"></script>
<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-mapevents.js"></script>

<!-- BODY -->
<h1>Adding an Overlay to the Map</h1>
<p>This example displays a movable map initially centered on the historical centre of <b>Berlin</b> (<i>52.515, °N, 13.405°E</i>) with an overlay of a historical map from 1789 on top of the base map. A public domain image was used as a source, and split it into individual map tiles. Additional tiles are only downloaded when the zoom level or location changes.</p>
<hr/>
<div id="map" style="width: 600px; height: 400px; background: grey"></div>
<hr/>
<h2>Credits</h2>
<blockquote>
<code>Wikimedia Commons Images</code><br/>
<small>
The tile source is based on <a href="https://commons.wikimedia.org/wiki/File%3AMap_de_berlin_1789_%28georeferenced%29.jpg">https://commons.wikimedia.org/wiki/File%3AMap_de_berlin_1789_%28georeferenced%29.jpg</a><br/>

Images provided by Wikimedia Commons are under the copyright of their owners.<br/>
However, almost all content hosted on Wikimedia Commons may be freely reused subject to certain restrictions.<br/>
(<a href="https://commons.wikimedia.org/wiki/Commons:Reusing_content_outside_Wikimedia">https://commons.wikimedia.org/wiki/Commons:Reusing_content_outside_Wikimedia</a>)<br/>
</small>
</blockquote>

